<template>
  <div id="app">
    <router-view />
  </div>
</template>

<script>
import './styles/common.css'
var recalc = null
var rem = function(doc, win) {
  var docEl = doc.documentElement
  var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'
  console.log(1)
  recalc = function() {
    var clientWidth = docEl.clientWidth
    if (!clientWidth) return
    if (clientWidth >= 1920) {
      docEl.style.fontSize = 100 * (clientWidth / 1920) + 'px'
    } else {
      docEl.style.fontSize = 100 * (clientWidth / 1920) + 'px'
    }
  }
  if (!doc.addEventListener) return
  win.addEventListener(resizeEvt, recalc, false)
  doc.addEventListener('DOMContentLoaded', recalc, false)
  recalc()
}
export default {
  name: 'App',
  updated() {
    if (!recalc) {
      if (this.$route.path == '/index' || this.$route.path == '/login' || this.$route.path == '/regist') {
        rem(document, window)
      } 
    } else {
      if (this.$route.path != '/index' && this.$route.path != '/login' && this.$route.path != '/regist') {
        document.documentElement.removeAttribute('style')
        var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'
        window.removeEventListener(resizeEvt, recalc, false)
        document.removeEventListener('DOMContentLoaded', recalc, false)
        recalc = null
      }
    }
  }

}
</script>
<style>
	.red {
	    color: #FF0036;
	}
	.blue {
	    color: #014ccc;
	}
	.orange {
	    color: orange;
	}
	.green {
	    color: green;
	}
	.hulue {
	    color: green !important;
	}
	.lanjie {
	    color: #000000 !important;
	}
	.jinji {
	    color: red !important;
	}
	.yanzhong {
	    color: #BA55D3 !important;
	}
	.butuijian {
	    color: orange !important;
	}
	.qingwei {
	    color: blue !important;
	}
	.zdts {
	    color: #00CD00 !important;
	}
</style>
